<template>
    <div class="page-wrapper">
        <img src="@/assets/images/404_animation.gif" alt="" class="image-404">
        <br/>
        <el-link @click="handleBackHome">返回首页</el-link>
    </div>
</template>

<script lang='ts'>
import { defineComponent } from 'vue';
import useCurrentInstance from '@/hooks/useCurrentInstance'
export default defineComponent({
    setup() {
        // 全局方法
        const {proxy:vm} = useCurrentInstance();

        const handleBackHome = () => {
            vm.$router.push({
                path: '/'
            })

        }

        return {
            handleBackHome
        }
    }
})
</script>


<style scoped>
.page-wrapper {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.image-404 {
    width: 800px;
    height: 600px;
    margin: 0 auto;
}
</style>